<template>
	<view style="margin: 30rpx;">
		<view class="comment" v-for="(item,index) in commentList" :key="index">
			<view class="comment-head">
				<view class="schol-name">
					<text>{{item.createTime|getPublishTime}}·{{item.regionName}}</text>
				</view>
			</view>
			<view class="content">
				<text class="content-txt">{{ item.content }}</text>
			</view>
			<view class="bottom">
				<view class="bottom-txt"  @click.stop="jumpPost(item.postId)">
					<view v-if="item.pid">回复评论：{{item.previousContent}}</view>
					<view v-else>回复帖子：{{item.title}}</view>
				</view>

			</view>
			<u-gap v-if="commentList.length!==index+1" style="margin-top: 20rpx;" height="1" bg-color="#e8e8e8"></u-gap>
		</view>
	</view>
</template>

<script>
	import CommentDetail from './comment-detail.vue'
	export default {
		name: "CommentList",
		components: {
			CommentDetail
		},
		props: {
			commentList: {
				type: Array
			}
		},
		data() {
			return {
				showAction: false,
				showCommentDetail: false,
				actionList: [{
					text: '投诉',
					subname: '辱骂攻击、广告、违法违规等',
					key: "complaint"
				}],
				chooseIndex: undefined,
				chooseComment: undefined
			};
		},
		filters: {
			getPublishTime(dateString) {
				return uni.$u.timeFrom(new Date(dateString), false)
			},
		},
		onLoad() {

		},
		methods: {
			jumpPost(id){
				let url;
				url = "/pages/platform/post/post-detail?id=" + id
				uni.navigateTo({
					url: url
				})
			},
			getCommentDetail() {
				this.$refs.commentDetail.replyDetailComment()
			},
			reply(comment) {
				this.$emit('reply', comment)
			},
			handelAction(index) {
				this.chooseIndex = index;
				this.showAction = true;
			},
			onAction() {

			},
			imageUrl(itemUrl) {
				return this.handleUrl(itemUrl)
			},
			closeCommentDetail() {
				this.showCommentDetail = false
				this.$emit('closeCommentDetail')
			},
			// 跳转到全部回复
			toAllReply(comment) {
				this.chooseComment = comment
				this.$emit('toAllReply', comment)
				this.showCommentDetail = true
			},

			reloadAllReply(comment) {
				console.log(comment);
				this.chooseComment = comment

			},

			// 点赞
			getLike(index) {
				this.commentList[index].isLike = !this.commentList[index].isLike;
				if (this.commentList[index].isLike == true) {
					this.commentList[index].likeNum++;
				} else {
					this.commentList[index].likeNum--;
				}
			},

		}
	};
</script>

<style lang="scss" scoped>
	.comment {
		display: flex;
		padding: 10rpx 0;
		flex-direction: column;

		.comment-head {
			display: flex;
			margin-bottom: 20rpx;

			.schol-name {
				font-size: 24rpx;
				color: #999;
			}

		}

		.content {
			display: flex;
			margin-bottom: 10rpx;

			font-size: 14px;
			font-weight: 700;

			.content-txt {
				overflow: hidden;
				display: -webkit-box;
				-webkit-line-clamp: 5;
				-webkit-box-orient: vertical;
				word-break: break-all;
			}
		}


		.bottom {
			display: flex;
			margin-top: 10rpx;
			padding: 15rpx;
			color: #7a7a7a;
			background: rgb(242, 242, 242);

			.bottom-txt {
				overflow: hidden;
				display: -webkit-box;
				-webkit-line-clamp: 2;
				-webkit-box-orient: vertical;
				word-break: break-all;
			}

		}
	}
</style>